<template>
  <!-- 实测实量检查项维护 -->
  <base-breadcrumb :title="$route.meta.title">
        <!-- <title-name :title="$route.meta.title" /> -->
        <a-row :gutter="10" class="page-height">
          <a-col :span="4" style="border-right: 1px solid #d9d9d9" >
          <a-card
            style="border-right:1px solid #d9d9d9"
              class="page-height-tree"
            >
             <!-- 树搜索 -->
            <TreeInspection
              ref="treeInspection"
              :show-button="level == 0"
              :minHeight="treeHeight + 'px'"
              is-all
              :showEnabledButton="level == 0"
              :selected-keys.sync="selectedKeys"
              :select-options.sync="selectOptions"
              :add-disable="addDisable"
              @loader="search"
            />
          </a-card>

          </a-col>
          <a-col :span="20" class="page-height-list-wrapper" style="background:#fff">
            <searchData :search-data="searchArr" @search="search"  />
            <div class="page-height-list">
            <a-row type="flex" justify="space-between" align="top">
              <!-- 组织等级tabs -->
              <a-col>
                <TabsOrgLevels :id.sync="checkItemLevelId" :option.sync="checkItemOption" @switch="handleSwitch" />
              </a-col>
              <!-- 操作栏 -->
              <a-col>
                <a-button
                  v-btnPermission="[
                        {
                          ident: 'prma_seex',
                          code: 'seex_qm_031_add_01'
                        },
                        {
                          ident: 'prma_buco',
                          code: 'buco_qm_031_add_01'
                        }
                ]"
                  type="primary"
                  icon="plus"
                  :disabled="hasChildren || !selectOptions.enabled || !isSelf"
                  @click="handleManage(0)"
                >
                  添加检查项
                </a-button>
              </a-col>
            </a-row>
            <!-- 表格 -->
            <list-table
              ref="table"
              table-layout="fixed"
              size="default"
              row-key="id"
              :columns="columns"
              :request="loadData"
              :alert="true"
              show-size-changer
              show-quick-jumper
              show-pagination="auto"
            >
              <!-- 表格行操作栏 -->
              <span slot="action" slot-scope="text, record">
                <MoreButton>
                  <a v-btnPermission="[
                        {
                          ident: 'prma_seex',
                          code: 'seex_qm_031_loo_03'
                        },
                        {
                          ident: 'prma_buco',
                          code: 'buco_qm_031_loo_03'
                        }
                ]" @click="handleManage(2, record)">查看</a>
                  <template v-if="selectOptions.enabled && record.whetherEdit == '1'">
                    <a v-btnPermission="[
                        {
                          ident: 'prma_seex',
                          code: 'seex_qm_031_edi_02'
                        },
                        {
                          ident: 'prma_buco',
                          code: 'buco_qm_031_edi_02'
                        }
                ]" @click="handleManage(1, record)">编辑</a>
                  </template>
                  <!-- <template v-if="selectOptions.enabled && record.whetherRestructure == '1'">
                    <a-divider v-btnPermission="'qm_031_rec_06'" type="vertical" />
                    <a v-btnPermission="'qm_031_rec_06'" @click="handleManage(3, record)">重构</a>
                  </template> -->
                  <template v-if="selectOptions.enabled && record.whetherEdit == '1'">
                    <a v-btnPermission="[
                        {
                          ident: 'prma_seex',
                          code: 'seex_qm_031_sta_05'
                        },
                        {
                          ident: 'prma_buco',
                          code: 'buco_qm_031_sta_05'
                        }
                ]" v-if="record.status == 0" @click="handleRemove(record)">启用</a>
                    <a v-btnPermission="[
                        {
                          ident: 'prma_seex',
                          code: 'seex_qm_031_sto_04'
                        },
                        {
                          ident: 'prma_buco',
                          code: 'buco_qm_031_sto_04'
                        }
                ]" v-else class="del_btn" @click="handleRemove(record)">停用</a>
                  </template>
                </MoreButton>
              </span>
            </list-table>
            </div>
          </a-col>
        </a-row>
    <!-- 表单弹窗 -->
    <DialogEdit :visible.sync="visible" :editModel="editModel" :form="form" @refresh="search()" />
  </base-breadcrumb>
</template>

<script>
import DialogEdit from '../components/DialogEdit' // 表单弹窗
import { STable } from '@/components' // 表格
import { checkItem } from '@/api/quality/reality' // 实测实量api
import TabsOrgLevels from '@/components/businessComponents/TabsOrgLevels' // tabs
import TreeInspection from '@/components/businessComponents/TreeInspection' // 树
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import SelectProject from '@/components/Select/SelectProject' // 项目名称
import Selector from '@/components/Select/Selector' // 项目名称
import OrgTreeSelect from '@/components/OrgTreeSelect'

const searchArr = [
  // 搜索框
  // {
  //   name: '所属单位',
  //   valueKey: 'searchQuery',
  //   type: OrgTreeSelect,
  // },
  // {
  //   name: '分公司',
  //   type: SelectSubCompany,
  //   placeholder: '请选择',
  //   valueKey: 'branchCompanyId'
  // },
  // {
  //   name: '项目名称',
  //   type: SelectProject,
  //   placeholder: '请选择',
  //   valueKey: 'projectId'
  // },
  {
    name: '判定类型',
    valueKey: 'judgmentTypeId',
    type: Selector,
    selectType: '16'
  },
  {
    name: '检查项名称',
    value: 'checkItemName',
    type: 'input'
  },
  {
    name: '测量单位',
    value: 'unit',
    type: 'input'
  }
]
const columns = [
  {
    title: '检查项编号',
    width: 180,
    ellipsis: true,
    dataIndex: 'checkItemCode'
  },
  {
    title: '检查项名称',
    dataIndex: 'checkItemName',
    ellipsis: true,
    width: 150
  },
  {
    title: '所属',
    dataIndex: 'belong',
    ellipsis: true,
    width: 230
  },
  {
    title: '判定类型',
    dataIndex: 'judgmentType',
    width: 130
  },
  {
    title: '最小偏差值',
    dataIndex: 'negativeDeviation',
    width: 130
  },
  {
    title: '标准值',
    dataIndex: 'standardValue',
    width: 130
  },
  {
    title: '最大偏差值',
    dataIndex: 'positiveDeviation',
    width: 130
  },
  {
    title: '测量单位',
    dataIndex: 'unit',
    width: 100
  },
  {
    title: '操作',
    dataIndex: 'action',
    fixed: 'right',
    align: 'center',
    width: 200,
    scopedSlots: { customRender: 'action' }
  }
]
export default {
  name: 'a' + Date.now(),
  components: {
    STable,
    DialogEdit,
    TreeInspection,
    TabsOrgLevels
  },
  computed: {
    // 当前选中组织,是否属于登陆人组织权限
    isSelf() {
      return this.level === this.checkItemOption.code
    },
    // 是否有子节点
    hasChildren() {
      return (
        !this.selectOptions.parentId || this.selectedKeys.length < 1 || this.selectOptions.dataRef?.children?.length > 0
      )
    },
    // 表格列表请求参数
    args() {
      let args = this.queryParam
      // 添加分部分项id
      this.selectedKeys.length > 0 && (args.treeId = this.selectedKeys[0])
      // 添加检查项等级
      this.checkItemLevelId && (args.checkItemLevelId = this.checkItemLevelId)
      return args
    }
  },
  data() {
    this.columns = columns
    this.searchArr = searchArr
    return {
      treeHeight: 'auto', // 树高度
      addDisable: false, // 新增节点按钮禁用状态
      checkItemLevelId: '', // 检查项等级
      checkItemOption: {}, // 选中检查项等级
      option: {}, // 检查项等级选中对象
      option2: {}, // 判定类型选中对象
      editModel: 0, // 操作类型：0 ：添加 ；1 ：编辑 ；2： 查看；3：重构
      visible: false, // 弹窗控件
      selectedKeys: [], // 选中节点
      selectOptions: {}, // 选中节点对象
      form: null, // 弹窗参数
      level: sessionStorage.getItem('currentLevel'),
      queryParam: {}, // 查询参数
      // 加载数据方法 必须为 Promise 对象
      loadData: (parameter) => {
        if (this.selectedKeys && this.selectedKeys.length > 0) {
          const requestParameters = Object.assign({}, parameter, this.args)
          this.addDisable = true
          return checkItem.postList(requestParameters).then((res) => {
            if (res.data?.length == 0 || this.hasChildren) {
              this.addDisable = false
            }
            // 设置树高度和表格保持一致
            if (this.$refs.table?.$el.clientHeight) {
              setTimeout(() => {
                this.treeHeight = this.$refs.table?.$el.clientHeight - 30
              },500)
            }
            return res
          })
        }
      }
    }
  },
  mounted() {
    let that = this
    // 获取分项工程
    that.$refs.treeInspection.getList().then(() => {
      that.search()
    })
  },
  methods: {
    /**
     * 切换检查项等级
     */
    handleSwitch() {
      this.$nextTick(() => {
        this.$refs.table.refresh(true)
      })
    },
    /**
     * 头部搜索
     */
    search(value) {
      // 赋值表单
      if (value) {
        this.queryParam = value
      }
      this.$refs.table?.refresh(true)
    },
    /**
     * 移除区域
     */
    handleRemove(e) {
      let that = this
      let status = ['启用', '停用'][e.status] || '操作'
      that.$confirm({
        title: '温馨提示',
        content: `确认${status}？`,
        okText: '提交',
        cancelText: '关闭',
        onOk() {
          return checkItem.switchStatus({ id: e.id }).then((res) => {
            that.$message.success(status + '成功！')
            that.$refs.table.loadData()
          })
        }
      })
    },
    /**
     * 检查项：新增/编辑/查看
     */
    handleManage(b, a) {
      // b 操作类型;a 行数据
      this.option = {}
      this.option2 = {}
      if (b) {
        this.form = this.$clone(a)
      } else {
        let form = {}
        form.checkItemLevelCode = sessionStorage.getItem('currentLevel') // 组织级别
        form.subItemId = this.selectOptions.id
        form.subItemName = this.selectOptions.name
        this.form = form
      }
      this.editModel = b
      // 添加
      this.visible = true // 打开弹窗
    }
  }
}
</script>
<style lang="less" scoped>
.text_name {
  margin-top: -3px;
}
.dialogForm {
  /deep/.ant-form-item {
    .ant-form-item-label {
      width: 150px;
    }
    .ant-form-item-control-wrapper {
      width: calc(100% - 150px);
    }
  }
}
</style>
